/** @format */

import React, {Component} from 'react';
import {name as appName} from './app.json';
import styles from './app/Styles/main';
import Icons from './app/Assets/Icon.js';
import MovieList from './app/Components/MovieList';
import USBox from './app/Components/USBox';
import Featured from './app/Components/Featured';
import Search from './app/Components/Search';
import User from './app/Components/User';

import { AppRegistry,TabBarIOS } from 'react-native';

class MovieTalk extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedTab: 'user'
    }
  }

  render() {
    return (
      
      <TabBarIOS barTintColor="darkslateblue" tintColor="white">
        <TabBarIOS.Item
          systemIcon="featured"
          title="推荐电影"
          //icon={{uri:'./app/Assets/ei.png' }}
          //selectedIcon={{uri:'./app/Assets/ho.png' }}
          selected={this.state.selectedTab === 'top250'}
          onPress={ ()=> {
            this.setState(
              { selectedTab: 'top250' }
            )
          }}
        >
          <Featured />
        </TabBarIOS.Item>
        <TabBarIOS.Item
          systemIcon="most-viewed"
          title="北美票房"
          selected={this.state.selectedTab === 'us_box'}
          onPress={ ()=> {
            this.setState(
              { selectedTab: 'us_box' }
            )
          }}
        >
          <USBox />
        </TabBarIOS.Item>
        <TabBarIOS.Item
          systemIcon="search"
          title="搜索"
          selected={this.state.selectedTab === 'search'}
          onPress={ ()=> {
            this.setState(
              { selectedTab: 'search' }
            )
          }}>
          <Search />
        </TabBarIOS.Item>

        <TabBarIOS.Item
          systemIcon="contacts"
          //icon={{ uri: Icons.user, scale:3.3 }}
          title="我的"
          selected={this.state.selectedTab === 'user'}
          onPress={ ()=> {
            this.setState(
              { selectedTab: 'user' }
            )
          }}>
          <User />
        </TabBarIOS.Item>
      </TabBarIOS>
    );
  }
}

AppRegistry.registerComponent(appName, () => MovieTalk);
